<template>
  <div class="div">
    <div class="div1">
      <p>项目演示</p>
      <img src="https://i.52112.com/icon/jpg/256/20180402/13692/873447.jpg" class="img">
      <div>
        <img src="../MSite/images/pj.png" width="15px"height="15px">
        <a>4.2</a>
        <span>月售196</span>
        <span>配送约50分钟</span>
      </div>
    </div>
    <div class="div4">
      <span class="span">最好吃的东西都在这</span>
    </div>
    <div class="div2">
      <span>25减1 | 35减2 | 60减4</span>
      <span>返2元券</span>
      <span>首单减14</span>
    </div>
    <div class="div3">
      <van-notice-bar
        left-icon="volume-o"
        text="这只是一个项目演示。这只是一个项目演示。这只是一个项目演示。这只是一个项目演示。"
      />
    </div>
  </div>
</template>

<script>
export default {
  name: "shop"
}
</script>

<style scoped>
  .div{
    background-color: white;
    border-radius: 20px 20px 0px 0px;
  }
  .div1{
    margin: 10px;
  }
  .div1 > div >span{
    font-size: 10px;
  }
  .div2 > span{
    margin: 10px;
    font-size: 10px;
    color: red;
    border: 1px solid #ff1a1a;
    border-radius: 4px;
  }
  .div3{
    margin: 10px 10px 0px 10px;
  }
  .div4{
    margin: 10px;
  }
  .span{
    font-size: 10px;
    color: #999999;
    background-color: #e7e4e4;
    border-radius: 4px;
    padding: 3px;
  }
  .img {
    width: 60px;
    height: 60px;
    position: absolute;
    top:70px;
    right: 20px;
  }
</style>
